<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="w" uri="/water-tags"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>container</title>
<s:component template="include-css-main.ftl"></s:component>
<s:component template="include-css-page.ftl"></s:component>
<s:component template="include-js-jquery.ftl"></s:component>
<style>
.left {
	float: left;
	width: 25%;
}

.left-l {
	padding-right: 2px;
	margin-right: 2px;
	border-right: 1px solid #99bbe8;
}

.right {
	margin-left: 25%;
}

/* ****************container control color  **begin */
/* border */
.l>.layout_1,.l>.layout_2,.l>.layout_3,.l>.layout_4,.l>.layout_5,.l>.layout_6,.l>.layout_middle,.l>.layout_contain
	{
	border-color: #b3d4fc;
}

.l>.layout_footer,.l>.layout_header {
	border-color: #0000ff;
}

.l>.layout_header_noborder,.l>.layout_footer_noborder {
	border-color: #0000ff;
}
/* background */
.l>.layout_1,.l>.layout_2,.l>.layout_3,.l>.layout_4,.l>.layout_5,.l>.layout_6,.l>.layout_footer,.l>.layout_header
	{
	background: #b3d4fc;
}
/* ****************container control color **end */
.accordion {
	
}

.accordion-header {
	padding-left: 3px;
	padding-right: 3px;
	height: 20px;
	font-size: 9pt;
	border-width: 0px;
	border-style: solid;
	border-bottom-width: 1px;
	background-color: #e5ecf9;
	border-color: #99bbe8; /*#f0f7f9;*/
}
</style>
</head>
<body>
	<s:url id="index_url" value="/" />
	<a href="${index_url}">主页</a>
	<br /><br />
	<div class="left">
		<div class="left-l">
			<w:container id="container1">
				<w:containerheader title="Country">国家</w:containerheader>
				<w:containermiddle>
					<s:bean name="org.apache.struts2.util.Counter" id="counter">
						<s:param name="first" value="1" />
						<s:param name="last" value="20" />
						<ul style="list-style-type: decimal">
							<s:iterator status="st">
								<li>${st.index}国家</li>
							</s:iterator>
						</ul>
					</s:bean>

				</w:containermiddle>
				<w:containerfooter>青岛啤酒</w:containerfooter>
			</w:container>
			<br />
			<w:container id="container2" displayBorder="false">
				<w:containerheader title="公司通知" displayBorder="false" cssStyle="color:#0000ff" >区域</w:containerheader>
				<w:containermiddle displayBorder="false" cssStyle="color:#ff0000">
					<s:bean name="org.apache.struts2.util.Counter" id="counter">
						<s:param name="first" value="1" />
						<s:param name="last" value="10" />
						<ul style="list-style-type: decimal">
							<s:iterator status="st">
								<li>${st.index}区域</li>
							</s:iterator>
						</ul>
					</s:bean>
				</w:containermiddle>
				<w:containerfooter displayBorder="false" cssStyle="color:#00ff00">中华人民共和国</w:containerfooter>
			</w:container>
		</div>
	</div>
	<div class="right">
		<w:container id="container3" >
			<w:containerheader title="Country">Country</w:containerheader>
			<w:containermiddle>
				<s:bean name="org.apache.struts2.util.Counter" id="counter">
					<s:param name="first" value="1" />
					<s:param name="last" value="40" />
					<ul style="list-style-type: decimal">
						<s:iterator status="st">
							<li>${st.index}middle</li>
						</s:iterator>
					</ul>
				</s:bean>
			</w:containermiddle>
			<w:containerfooter>Footer-青山依旧在，几度夕阳红！</w:containerfooter>
		</w:container>
	</div>
</body>
</html>